<%#
 Copyright 2010 Jo-Philipp Wich <jow@openwrt.org>
 Licensed to the public under the Apache License 2.0.
-%>

<%-
	local ntm = require "luci.model.network".init()
	local fwm = require "luci.model.firewall".init()

	local net
	local ifaces = { }
	local netlist = { }
	for _, net in ipairs(ntm:get_networks()) do
		if net:name() ~= "loopback" then
			local z = fwm:get_zone_by_network(net:name())
			ifaces[#ifaces+1] = net:name()
			netlist[#netlist+1] = {
				net:name(), z and z:name() or "-", z
			}
		end
	end

	table.sort(netlist,
		function(a, b)
			if a[2] ~= b[2] then
				return a[2] < b[2]
			else
				return a[1] < b[1]
			end
		end)
-%>
<style type="text/css">
	.action a{
		color: #06c;
		text-decoration: none;
	}
	.action a:hover, a:focus{
		color: #039;
		cursor: pointer;
		text-decoration: underline;
	}

	.text-explode {
		color: #ccc !important;
		font-weight: normal !important;
		margin: 0 4px !important;
	}
</style>
<script type="text/javascript" src="<%=resource%>/cbi.js?v=git-18.038.25564-8fe5d3d"></script>
<script type="text/javascript">//<![CDATA[
	function iface_shutdown(id, reconnect) {
		if (!reconnect && !confirm(String.format('<%_Really shutdown interface "%s" ?\nYou might lose access to this device if you are connected via this interface.%>', id)))
			return;

		var d = document.getElementById(id + '-ifc-description');
		if (d)
			d.innerHTML = reconnect
				? '<em><%:Interface is reconnecting...%></em>'
				: '<em><%:Interface is shutting down...%></em>';

		var s = document.getElementById('ifc-rc-status');
		if (s)
		{
			s.parentNode.style.display = 'block';
			s.innerHTML = '<%:Waiting for changes to be applied...%>';
		}

		(new XHR()).post('<%=url('admin/network')%>/iface_' + (reconnect ? 'reconnect' : 'shutdown') + '/' + id, { token: '<%=token%>' },
			function(x)
			{
				if (s)
				{
					s.innerHTML = reconnect
						? '<%:Interface reconnected%>'
						: '<%:Interface shut down%>';

					window.setTimeout(function() {
						s.parentNode.style.display = 'none';
					}, 1000);
				}
			}
		);
	}

	function iface_delete(id) {
		if (!confirm('<%:Really delete this interface? The deletion cannot be undone!\nYou might lose access to this device if you are connected via this interface.%>'))
			return;

		(new XHR()).post('<%=url('admin/network/iface_delete')%>/' + id, { token: '<%=token%>' },
			function(x) {
				location.href = '<%=url('admin/network/network')%>';
			}
		);
	}

	var iwxhr = new XHR();
	var wifidevs = <%=luci.http.write_json(netdevs)%>;
	var arptable = <%=luci.http.write_json(arpcache)%>;

	XHR.poll(5, '<%=url('admin/network/iface_status', table.concat(ifaces, ","))%>', null,
		function(x, ifcs)
		{
			if (ifcs)
			{
				for (var idx = 0; idx < ifcs.length; idx++)
				{
					var ifc = ifcs[idx];
					var html = '';
					var pr = document.getElementById(ifc.id + '-ifc-proto');
					var ty = document.getElementById(ifc.id + '-ifc-type');
					pr.innerHTML = ifc.proto;
					ty.innerHTML = ifc.type;
					var s = document.getElementById(ifc.id + '-ifc-devices');
					if (s)
					{
						var stat = String.format(
							'<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px; vertical-align:middle" />',
								ifc.type,
								ifc.is_up ? '' : '_disabled'
						);

						if (ifc.subdevices && ifc.subdevices.length)
						{
							stat += ' <strong>(';

							for (var j = 0; j < ifc.subdevices.length; j++)
							{
								var sif = ifc.subdevices[j];

								stat += String.format(
									'<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px; vertical-align:middle" title="%h" />',
										sif.type,
										sif.is_up ? '' : '_disabled',
										sif.name
								);
							}

							stat += ')</strong>';
						}

						stat += String.format(
							'<br /><small>%h</small>',
								ifc.name
						);

						s.innerHTML = stat;
					}

					var d = document.getElementById(ifc.id + '-ifc-description');
					if (d && ifc.proto && ifc.ifname)
					{
						if (ifc.is_up)
						{
							html += String.format('<strong><%:Uptime%>:</strong> %t<br />', ifc.uptime);
						}

						if (ifc.macaddr)
						{
							html += String.format('<strong><%:MAC-Address%>:</strong> %s<br />', ifc.macaddr);
						}

						html += String.format(
							'<strong><%:RX%></strong>: %.2mB (%d <%:Pkts.%>)<br />' +
							'<strong><%:TX%></strong>: %.2mB (%d <%:Pkts.%>)<br />',
								ifc.rx_bytes, ifc.rx_packets,
								ifc.tx_bytes, ifc.tx_packets
						);

						if (ifc.ipaddrs && ifc.ipaddrs.length)
						{
							for (var i = 0; i < ifc.ipaddrs.length; i++)
								html += String.format(
									'<strong><%:IPv4%>:</strong> %s<br />',
									ifc.ipaddrs[i]
								);
						}

						if (ifc.ip6addrs && ifc.ip6addrs.length)
						{
							for (var i = 0; i < ifc.ip6addrs.length; i++)
								html += String.format(
									'<strong><%:IPv6%>:</strong> %s<br />',
									ifc.ip6addrs[i]
								);
						}

						d.innerHTML = html;
					}
					else if (d && !ifc.proto)
					{
						var e = document.getElementById(ifc.id + '-ifc-edit');
						if (e)
							e.disabled = true;

						d.innerHTML = String.format(
							'<em><%:Unsupported protocol type.%></em><br />' +
							'<a href="%h"><%:Install protocol extensions...%></a>',
								'<%=url("admin/system/packages")%>?query=luci-proto&display=available'
						);
					}
					else if (d && !ifc.ifname)
					{
						d.innerHTML = String.format(
							'<em><%:Network without interfaces.%></em><br />' +
							'<a href="<%=url("admin/network/network/%s")%>?tab.network.%s=physical"><%:Assign interfaces...%></a>',
								ifc.name, ifc.name
						);
					}
					else if (d)
					{
						d.innerHTML = '<em><%:Interface not present or not connected yet.%></em>';
					}
				}
			}
		}
	);
//]]></script>

<fieldset class="cbi-section" style="display:none">
	<legend><%:Reconnecting interface%></legend>
	<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" />
	<span id="ifc-rc-status"><%:Waiting for changes to be applied...%></span>
</fieldset>

<div class="cbi-map">
	<fieldset class="cbi-section">

	<div class="widget-box">
	<div class="widget-title">
		<span class="icon">
		<i class="icon-align-justify"></i>
		</span>
		<h5><%:Interface Overview%></h5>
		<div class="pull-right">
			<div style="margin-top: 4px; margin-bottom: 0px;margin-right:4px">
			<a class="btn btn-primary" href="<%=luci.dispatcher.build_url("admin/network/iface_add")%>">
				<i class="icon icon-plus" ></i>
				<%:Add new interface...%>
			</a>
			</div>
		</div>
	</div>
	<div class="widget-content nopadding">

		<table class="cbi-section-table" style="empty-cells:hide">
			<tr class="cbi-section-table-titles">
				<th class="cbi-section-table-cell" style="text-align:left;width:10%"><%:Interface%></th>
				<th class="cbi-section-table-cell" style="text-align:left;width:10%"><%:Network zone%></th>
				<th class="cbi-section-table-cell" style="text-align:left;width:10%"><%:Interface%><%:Type%></th>
				<th class="cbi-section-table-cell" style="text-align:left;width:10%"><%:Protocol%></th>
				<th class="cbi-section-table-cell" style="text-align:left;width:20%"><%:Physical interface%></th>
				<th class="cbi-section-table-cell" style="text-align:left;width:20%"><%:Status%></th>
				<th class="cbi-section-table-cell" style="text-align:left"><%:Actions%></th>
			</tr>
			<%
				for i, net in ipairs(netlist) do
					local z = net[3]
					local c = z and z:get_color() or "#EEEEEE"
					local t = z and translate("Part of zone %q" % z:name()) or translate("No zone assigned")
					local zone = z and z:name() or "<:None>"
			%>
				<tr class="cbi-section-table-row cbi-rowstyle-<%=i % 2 + 1%>">
					<td style="vertical-align:middle;">
						<%=net[1]:upper()%>
					</td>
					<td style="vertical-align:middle;">
						<%=pcdata(zone)%>
					</td>
					<td id="<%=net[1]%>-ifc-type" style="vertical-align:middle;">
							-
					</td>
					<td id="<%=net[1]%>-ifc-proto" style="vertical-align:middle;">
							-
					</td>
					
					<td>
						<div>
							
							<div  id="<%=net[1]%>-ifc-devices">
								<img src="<%=resource%>/icons/ethernet_disabled.png" style="width:16px; height:16px" /><br />
								<small>?</small>
							</div>
						</div>
					</td>
					
					<td  id="<%=net[1]%>-ifc-description">
						<em><%:Collecting data...%></em>
					</td>
					<td class="action">
						
						<a onclick="iface_shutdown('<%=net[1]%>', true)" title="<%:Reconnect this interface%>">
							<%:Connect%>
						</a>
						<span class="text-explode">|</span>
						<a onclick="iface_shutdown('<%=net[1]%>', false)" title="<%:Shutdown this interface%>">
							<%:Stop%>
						</a>
						<span class="text-explode">|</span>
						<a onclick="location.href='<%=url("admin/network/network", net[1])%>'" title="<%:Edit this interface%>" id="<%=net[1]%>-ifc-edit">
							<%:Edit%>
						</a>
						<span class="text-explode">|</span>
						<a onclick="iface_delete('<%=net[1]%>')" title="<%:Delete this interface%>">
							<%:Delete%>
						</a>
					</td>
				</tr>
			<% end %>
		</table>

		
	</div>
	</div>
	</fieldset>
</div>
